<svg:g
  class="link"
  [attr.link_id]="link.id"
  [attr.map-source]="link.source.id"
  [attr.map-target]="link.target.id"
  [attr.transform]="transform"
>
  <svg:path
    #path
    *ngIf="link.linkType == 'ethernet'"
    class="ethernet_link"
    stroke="#000"
    stroke-width="2"
    [attr.d]="d"
  />

  <svg:path
    #path
    *ngIf="link.linkType == 'serial'"
    class="serial_link"
    stroke="#B22222"
    fill="none"
    stroke-width="2"
    [attr.d]="d"
  />

  <svg:g [app-status]="link.source.status" [direction]="'source'" [path]="path" [d]="d" />

  <svg:g [app-status]="link.target.status" [direction]="'target'" [path]="path" [d]="d" />

  <svg:g
    *ngIf="showInterfaceLabels"
    [app-interface-label]
    [x]="link.source.x + link.nodes[0].label.x"
    [y]="link.source.y + link.nodes[0].label.y"
    [text]="link.nodes[0].label.text"
    [style]="link.nodes[0].label.style"
    [rotation]="link.nodes[0].label.rotation"
  />

  <svg:g
    *ngIf="showInterfaceLabels"
    [app-interface-label]
    [x]="link.target.x + link.nodes[1].label.x"
    [y]="link.target.y + link.nodes[1].label.y"
    [text]="link.nodes[1].label.text"
    [style]="link.nodes[1].label.style"
    [rotation]="link.nodes[1].label.rotation"
  />
</svg:g>
